<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<HEAD>
		<TITLE> ZTREE DEMO - Async</TITLE>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" href="../css/zTreeStyle.css" type="text/css">
		<script type="text/javascript" src="../js/jquery-1.4.4.min.js" charset="utf-8"></script>
		<script type="text/javascript" src="../js/jquery.ztree.core-3.5.js" charset="utf-8"></script>
		<SCRIPT type="text/javascript">
		
			var setting = {
			    view:{
			    	showLine:true
			    },		
				 async: {
					enable: true,
					url: "/hello/getNum",
					dataFilter: filter
				}, 
				
			};
			
			

			function filter(treeId, parentNode, childNodes) {
				return childNodes;
			}

			$(document).ready(function() {
				$.fn.zTree.init($("#mytree"), setting);
			}); 
		
		</SCRIPT>
		
		
	</HEAD>

	<BODY>
		<h1>异步加载节点数据的树</h1>
		<h6>[ 文件路径: core/async.html ]</h6>
		<div class="content_wrap">
			<div class="zTreeDemoBackground left">
				<ul id="mytree" class="ztree"></ul>
			</div>
			<div class="right">
				<ul class="info">
					<li class="title">
						<h2>1、setting 配置信息说明</h2>
						<ul class="list">
							<li class="highlight_red">使用异步加载，必须设置 setting.async 中的各个属性，详细请参见 API 文档中的相关内容</li>
						</ul>
					</li>
					<li class="title">
						<h2>2、treeNode 节点数据说明</h2>
						<ul class="list">
							<li>异步加载功能对于 treeNode 节点数据没有特别要求，如果采用简单 JSON 数据，请设置 setting.data.simple 中的属性</li>
							<li>如果异步加载每次都只返回单层的节点数据，那么可以不设置简单 JSON 数据模式</li>
						</ul>
					</li>
					<li class="title">
						<h2>3、其他说明</h2>
						<ul class="list">
							<li class="highlight_red">观察 autoParam 和 otherParam 请使用 firebug 或 浏览器的开发人员工具</li>
							<li class="highlight_red">此 Demo 只能加载到第 4 级节点（level=3）</li>
							<li class="highlight_red">此 Demo 利用 dataFilter 对节点的 name 进行了修改</li>
						</ul>
					</li>
				</ul>
			</div>
		</div>
	</BODY>

</HTML>